<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="/common/template :: header(~{::title},~{::link},~{::style})">
</head>
<body>
    <div class="layui-form timo-compile">
    <form th:action="@{/member/agent/save}">
        <input type="hidden" name="id" th:if="${memberInfo}" th:value="${memberInfo.id}">
        <div class="layui-form-item">
            <label class="layui-form-label">用户</label>
            <div class="layui-input-inline">
                <input class="layui-input" type="text" name="nickname" placeholder="请输入昵称" th:value="${memberInfo?.nickname}">
            </div>
        </div>
        <div class="layui-form-item" id="area-picker">
            <div class="layui-form-label">代理区域</div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="province" class="province-selector" data-value="广东省" lay-filter="province-1">
                    <option value="">请选择省</option>
                </select>
            </div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="city" class="city-selector" data-value="深圳市" lay-filter="city-1">
                    <option value="">请选择市</option>
                </select>
            </div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="county" class="county-selector" data-value="龙岗区" lay-filter="county-1">
                    <option value="">请选择区</option>
                </select>
            </div>
        </div>
        
        <div class="layui-form-item timo-finally">
            <button class="layui-btn ajax-submit"><i class="fa fa-check-circle"></i>绑定</button>
            <button class="layui-btn btn-secondary close-popup"><i class="fa fa-times-circle"></i> 关闭</button>
        </div>
    </form>
</div>
<script th:replace="/common/template :: script"></script>
    <script>
       
        //一般直接写在一个js文件中
        layui.use(['layer', 'form', 'layarea'], function () {
            var layer = layui.layer
                , form = layui.form
                , layarea = layui.layarea;

            layarea.render({
                elem: '#area-picker',
                change: function (res) {
                    //选择结果
                    console.log(res);
                }
            });
        });
    </script>
</body>
</html>